<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>16110100410_李柃锋</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <style>
        h5,
        p {
            display: block;
            margin: 0;
            padding: 0;
        }

        a:link {
            text-decoration: none;
        }

        a:visited {
            text-decoration: none;
        }

        .box {
            margin: 10px;
            width: 250px;
            height: 110px;
        }

        table {
            border-collapse: collapse;
            font-size: 12px;
        }

        table,
        th,
        td {
            border: 1px solid #cacaf1;
        }

        table img {
            width: 90px;
            height: 60px;
            border: 1px solid #c9ccd0;
            padding: 2px;
        }

        th {
            background-color: #e9efff;
            padding: 4px 10px;
            text-align: left;
        }

        td {
            background-color: #f9faff;
            padding: 8px;
        }

        #box1 td>div {
            display: block;
            float: left;
            margin: 5px 10px;
        }
        #box1 p{
            text-align: center;
        }
        #box2 div {
            float: right;
            width: 55%;
        }
        #box2 h5{
            overflow: hidden;
            letter-spacing: 0.5px;
        }
        #box2 p{
            height: 4em;
            /* overflow: hidden;
            text-overflow:ellipsis; */
            text-indent: 2em;
            letter-spacing: 0.5px;
            line-height: 2em;
        }
    </style>
</head>

<body>
    <table class="box" id="box1">
        <th>饰纺视图</th>
        <tr>
            <td>
                <div>
                    <img src="img/1.png" alt="窗帘雅致客厅">
                    <p>窗帘雅致客厅</p>
                </div>
                <div>
                    <img src="img/2.png" alt="冬日纺织品主角">
                    <p>冬日纺织品主角</p>
                </div>
            </td>
        </tr>
    </table>
    <table class="box" id="box2">
        <th>饰纺公司</th>
        <tr>
            <td>
                <img src="img/3.jpg" alt="梦芭莎">
                <div>
                    <h5>梦芭莎贴身守护你</h5>
                    <p>融合了健康与时尚的设计理 …<a href="#">[详情]</a></p>
                    
                </div>

            </td>
        </tr>
    </table>
    <div class="box">
        <img src="img/jm.jpg" alt="九牧">
    </div>
</body>

</html>